<template>
  <div class="violationPage">
    <!-- <el-row>
      <el-col style="text-align: center;">
        <el-input
          v-model.trim="username"
          placeholder="输入单位名称"
          :style="'width:50%;margin:5px 0px;'"
          @keyup.enter.native="search"
        >
          <el-button slot="append" @click="search">搜索</el-button>
        </el-input>
      </el-col>
    </el-row>-->
    <el-row>
      <el-col :sm="4">
        <div class="g-title">报警数目({{total}}个）</div>
      </el-col>
    </el-row>
    <el-table
      ref="multipleTable"
      :data="listData"
      tooltip-effect="dark"
      border
      style="width: 100%"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55" align="center"></el-table-column>
      <el-table-column type="index" label="序号" width="55" align="center"></el-table-column>
      <el-table-column prop="companyName" label="单位名称" show-overflow-tooltip align="center"></el-table-column>
      <el-table-column label="OBD插拔次数" show-overflow-tooltip align="center">
        <template slot-scope="scope">
          <el-link type="primary" @click="showDetail(scope.row)">{{scope.row.count}}</el-link>
        </template>
      </el-table-column>
      <el-table-column label="无订单出行次数" show-overflow-tooltip align="center">
        <template slot-scope="scope">
          <!-- <el-link type="primary" @click="showDetail(scope.row,2)">0</el-link> -->
          <el-link type="primary"></el-link>
        </template>
      </el-table-column>
      <el-table-column label="围栏越界" show-overflow-tooltip align="center">
        <template slot-scope="scope">
          <!-- <el-link type="primary" @click="showDetail(scope.row,3)">0</el-link> -->
          <el-link type="primary"></el-link>
        </template>
      </el-table-column>
    </el-table>

    <el-row style="padding: 32px 16px;">
      <el-col>
        <el-pagination
          background
          layout="total, sizes, prev, pager, next, jumper"
          :page-size="pageSize"
          :total="total"
          :current-page="pageNo"
          @current-change="fetchData"
          @size-change="pageSizeChange"
        ></el-pagination>
      </el-col>
    </el-row>
    <detail ref="detail1Comp"></detail>
    <detail2 :dialogVisible.sync="dialogVisible2" :data="formData" :history="history"></detail2>
    <detail3 :dialogVisible.sync="dialogVisible3" :data="formData" :history="history"></detail3>
  </div>
</template>
<script>
import "./index.scss";
import { listTjJson } from "@/api/obd";
import detail from "./components/detail/index";
import detail2 from "./components/detail2/index";
import detail3 from "./components/detail3/index";
export default {
  components: { detail, detail2, detail3 },
  data: function() {
    return {
      username: "",
      dialogVisible: false,
      dialogVisible2: false,
      dialogVisible3: false,
      total: 0,
      pageNo: 1,
      pageSize: 10,
      listData: [], //全部数据
      listDataSelected: [], //选中数据
      formData: null,
      userCarApplyVisible: false, //申请用车组件可见
      history: [], //历史流程
      //报警类型  type_id
      types: [
        "保留",
        "SOS",
        "防盗",
        "入界",
        "断电",
        "高速/超速",
        "低速",
        "低电",
        "震动",
        "移动",
        "复位",
        "入盲区",
        "出盲区",
        "开车门",
        "关车门",
        "车辆已启动",
        "碰撞",
        "翻滚",
        "GE0(X)",
        "怠速",
        "疲驾",
        "网关",
        "拖车",
        "超停",
        "4s救援",
        "OBD故障",
        "油量报警",
        "安全驾驶提示",
        "高压",
        "OBD严重故障",
        "脱管报警",
        "蓝牙模块报警",
        "GPS信号于扰报警",
        "GSM信号干扰报警",
        "光电报警",
        "异常报警",
        "离线报警",
        "折卸报警",
        "停车报警",
        "干扰报警",
        "非法启动报警",
        "天窗未关",
        "车窗未关",
        "车门未锁",
        "车灯未关",
        "车辆未设防",
        "插拔报警",
        "磁感报警",
        "挪车提醒",
        "高温报警",
        "低温报警",
        "漏气报警",
        "轮胎低压",
        "轮胎高压",
        "上电提醒",
        "二押点进入",
        "二押点停留",
        "设备分离报警",
        "住址虚假报警",
        "年审到期",
        "保险到期",
        "保养到期提醒",
        "里程保养提醒",
        "出二押点报警",
        "路线偏移报警",
        "路线限速报警",
        "失联报警",
        "伪基站",
        "剪线报警",
        "超时报警",
        "车辆怠速提醒",
        "车辆水温过高",
        "急加速提醒",
        "急减速提醒",
        "急转弯提醒",
        "快速变道提醒",
        "路线限行报警",
        "井盖开报警",
        "井盖关报警",
        "急刹车提醒",
        "车辆设防",
        "车辆已熄火",
        "放电过流",
        "充电过流",
        "MOS超温",
        "低容量报警",
        "BMS故障报警",
        "运行异常",
        "运行正常",
        "设备插入",
        "设备拔出",
        "声控报警",
        "车辆已点火",
        "电池超温",
        "磁感报警",
        "防屏蔽报警",
        "屏蔽断油报警",
        "充电MOS管故障",
        "放电MOS管故障"
      ]
    };
  },
  created() {
    this.fetchData();
    this.login();
  },
  methods: {
    //登录服务器
    async login() {
      let url = `${this.obd_server}/GetDateServices.asmx/loginSystem`;
      let params = {
        LoginName: "obdapitest",
        //LoginName: "fangbing",
        LoginPassword: "123456",
        LoginType: "ENTERPRISE",
        language: "cn",
        ISMD5: "0",
        apply: "APP",
        loginUrl: "http://vipapi.18gps.net1"
      };
      let data = await this.jsonp(url, params);
      this.accountInfo = data;
      this.queryLocalAlarmInfoUtc();
    },
    //获取设备列表
    async queryLocalAlarmInfoUtc() {
      let url = `${
        this.obd_server
      }/GetDateServices.asmx/GetDate?timestamp=${new Date().getTime()}&method=queryLocalAlarmInfoUtc&school_id=${
        this.accountInfo.id
      }&mds=${this.accountInfo.mds}&max_time=1508103827687&type=custom`;
      let data = await this.jsonp(url);
      console.log(data);
    },
    showDetail(data, num) {
      if (num == 2) {
        this.dialogVisible2 = true;
      } else if (num == 3) {
        this.dialogVisible3 = true;
      } else {
        this.$refs.detail1Comp.open(data);
      }
    },
    //搜索
    search() {
      this.pageNo = 1;
      this.fetchData();
    },
    pageSizeChange(newSize) {
      this.pageSize = newSize;
      this.pageNo = 1;
      this.fetchData();
    },
    async fetchData(pageNo) {
      if (pageNo) {
        this.pageNo = pageNo;
      }
      let params = {
        pageNo: this.pageNo,
        pageSize: this.pageSize
        //  username: this.username
      };
      let data = await listTjJson(params);
      this.listData = data.data;
      this.total = data.total;
      this.listDataSelected.splice(0);
    },
    //表格多选
    handleSelectionChange(val) {
      this.listDataSelected.splice(0);
      val.forEach(function(e) {
        app.listDataSelected.push(e);
      });
      console.log(this.listDataSelected);
    }
  }
};
</script>